﻿<%@ page pageEncoding="UTF-8"%>
<%@include file="/util/tag.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <%@include file="../common/head.jsp"%>
    
    <script language="javascript" type="text/javascript">
            //保存结果的提示
            function showResult() {
                showResultDiv(true);
                window.setTimeout("showResultDiv(false);", 3000);
            }
            function showResultDiv(flag) {
                var divResult = document.getElementById("save_result_info");
                if (flag)
                    divResult.style.display = "block";
                else{
                    divResult.style.display = "none";
                    //location.href="list";
                    }
            }

            //切换资费类型
            function feeTypeChange(type) {
                var inputArray = document.getElementById("main").getElementsByTagName("input");
                if (type == 1) {
                    inputArray[4].readOnly = true;
                    inputArray[4].value = "";
                    inputArray[4].className += " readonly";
                    inputArray[5].readOnly = false;
                    inputArray[5].className = "width100";
                    inputArray[6].readOnly = true;
                    inputArray[6].className += " readonly";
                    inputArray[6].value = "";
                }
                else if (type == 2) {
                    inputArray[4].readOnly = false;
                    inputArray[4].className = "width100";
                    inputArray[5].readOnly = false;
                    inputArray[5].className = "width100";
                    inputArray[6].readOnly = false;
                    inputArray[6].className = "width100";
                }
                else if (type == 3) {
                    inputArray[4].readOnly = true;
                    inputArray[4].value = "";
                    inputArray[4].className += " readonly";
                    inputArray[5].readOnly = true;
                    inputArray[5].value = "";
                    inputArray[5].className += " readonly";
                    inputArray[6].readOnly = false;
                    inputArray[6].className = "width100";
                }
            }
            function validateForm(){
            	var b = false;
            	b = $('#costName').required('请填写姿费名称',$('#costNameMsg'));
            	if(b) b= $('#costName').range(1,50,'名称不能超过50个字符',$('#costNameMsg'));
            	if(b) b= $('#costName').remote('verifyName','名称已被占用',$('#costNameMsg'));
            	//var b2 = $('#baseDuration').intRange(1,600,'1-600之间的整数',$('#baseDurationMsg'));
            	return b;
            }
            $(function(){
            	$('#save').click(function(){
            		if(validateForm()){
            			var b=$('#costForm').submitForm('save','保存失败！','保存成功!',$('#save_result_info'));
            			if(b){
            				$('#save_result_info').attr("class","save_success");
            			}else{
            				$('#save_result_info').attr("class","save_fail");
            			}
            			showResult();
            		}
            	});
            	
            });
      
    </script>
    
    <body>
        <%@include file="../common/top.jsp"%>
        
        <div id="main">            
            <div id="save_result_info" class="save_fail">保存成功！</div><!-- 保存失败，资费名称重复！ -->
            <form action="#" method="get" class="main_form" id="costForm">
                <div class="text_info clearfix"><span>资费名称：</span></div>
                <div class="input_info">
                    <input type="text" class="width300" name="cost.name" id="costName"/>
                    <span class="required">*</span>
                    <div class="validate_msg_short" id="costNameMsg" style="color: red;"></div>
                </div>
                <div class="text_info clearfix"><span>资费类型：</span></div>
                <div class="input_info fee_type">
                    <input type="radio" name="cost.type" value="1" id="monthly" onclick="feeTypeChange(1);" />
                    <label for="monthly">包月</label>
                    <input type="radio" name="cost.type" value="2" checked="checked" id="package" onclick="feeTypeChange(2);" />
                    <label for="package">套餐</label>
                    <input type="radio" name="cost.type" value="3" id="timeBased" onclick="feeTypeChange(3);" />
                    <label for="timeBased">计时</label>
                </div>
                <div class="text_info clearfix"><span>基本时长：</span></div>
                <div class="input_info">
                    <input type="text" name="cost.baseDuration" class="width100" id="baseDuration"/>
                    <span class="info">小时</span>
                    <span class="required">*</span>
                    <div class="validate_msg_long" id="baseDurationMsg" style="color: red;"></div>
                </div>
                <div class="text_info clearfix"><span>基本费用：</span></div>
                <div class="input_info">
                    <input type="text" name="cost.baseCost" class="width100" />
                    <span class="info">元</span>
                    <span class="required">*</span>
                    <div class="validate_msg_long"></div>
                </div>
                <div class="text_info clearfix"><span>单位费用：</span></div>
                <div class="input_info">
                    <input type="text" name="cost.unitCost" class="width100" />
                    <span class="info">元/小时</span>
                    <span class="required">*</span>
                    <div class="validate_msg_long"></div>
                </div>
                <div class="text_info clearfix"><span>资费说明：</span></div>
                <div class="input_info_high">
                    <textarea class="width300 height70" name="cost.descr" ></textarea>
                    <div class="validate_msg_short"></div>
                </div>                    
                <div class="button_info clearfix">
                    <input type="button" value="保存" class="btn_save" id="save"/>
                    <input type="button" value="取消" class="btn_save" onclick="location.href='list';" />
                </div>
            </form>  
        </div>
        
        <%@include file="../common/bottom.jsp"%>
    </body>
</html>
